<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <title>Document</title>

  <style>
    .login-button {
      /* 按钮美化 */
      width: 270px;
      /* 宽度 */
      height: 40px;
      /* 高度 */
      border-width: 0px;
      /* 边框宽度 */
      border-radius: 3px;
      /* 边框半径 */
      background: #1E90FF;
      /* 背景颜色 */
      cursor: pointer;
      /* 鼠标移入按钮范围时出现手势 */
      outline: none;
      /* 不显示轮廓线 */
      font-family: Microsoft YaHei;
      /* 设置字体 */
      color: white;
      /* 字体颜色 */
      font-size: 17px;
      /* 字体大小 */
    }

    .login-button:hover {
      /* 鼠标移入按钮范围时改变颜色 */
      background: #5599FF;
    }
  </style>
<!-- 
    ———————————————— 版权声明：本文为CSDN博主「wangjingqiannihao」的原创文章，遵循CC 4.0 BY-SA版权协议，转载请附上原文出处链接及本声明。 原文链接：https: //blog.csdn.net/wangjingqiannihao/article/details/76152593 -->
</head>

<body>
  <button class="login-button">login</button>
</body>

</html>